<template>
  <div class="add-customer">
    <el-dialog :visible.sync="dialogVisible" title="产品二维码" width="500px" @close="cancelForm">
      <div style="text-align: center;">
        <img :src="url">
      </div>
      <div style="margin-top: 10px;text-align: center;">
        <el-button @click="cancelForm">关闭</el-button>
        <el-button type="primary" @click="download">下载图片</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import {downloadPng} from "@/utils/download";

export default {
  name: "ShowQrcode",

  data() {
    return {
      dialogVisible: false,
      id: '',
      url: ''
    };
  },

  mounted() {
  },

  methods: {
    download() {
      let erURl = this.url.match(/qr_codes(\S*)/)[0]
      downloadPng(erURl).then(res=>{
          let link = document.createElement('a')
          link.href = res
          link.download = '二维码_' + (new Date()).getTime() + '.png'
          link.click()
      })
    },

    cancelForm() {
      this.dialogVisible = false;
    }
  }
};
</script>

<style lang="scss" scoped>
.c-picker {
  width: 100% !important;
}
</style>
